/* ===============首页================ */
.border(@border-color:#ccc,@border-width:1px,@border-style:solid){
    border:@arguments;
}
.opacity(@num){
    opacity: @num;
    filter: ~"alpha(opacity="@num*100~')';
}
.border-radius(@radius){
    border-radius: @radius;
    -webkit-border-radius: @radius;
    -moz-border-radius: @radius;
}
.size(@w,@h){
    width: @w;
    height:@h;
}
.btn(@width,@height,@font-size,@color:inherit,@bg:inherit,@text-align:center){
    width: @width;
    height: @height;
    text-align: @text-align;
    line-height: @height;
    font-size: @font-size;
    color: @color;
    background: @bg;
}
.mixins(@width,@height,@line-height,@font-size,@color:inherit,@bg:inherit,@text-align:inherit){
    width: @width;
    height: @height;
    text-align: @text-align;
    line-height: @line-height;
    font-size: @font-size;
    color: @color;
    background: @bg;
}

.page-liangpin-index {
    /* 顶部推广 */
    .top-tuiguang {
        margin-bottom: 0;
    }
    .tg-big {
        //width: 900px;
        //height: 240px
        .size(900px,240px);
        position: relative;
        background: #fff;

        .slide-inner {
            //width: 900px;
            //height: 240px
            .size(900px,240px);
            overflow: hidden;
        }

        .slide-item {
            //width: 900px;
            //height: 240px
            .size(900px,240px);
            float: left;
        }

        .slide-ctrl {
            position: absolute;
            right: 20px;
            bottom: 10px;
            text-align: center;
            //width: 100%;
            //height:18px;
            .size(100%,18px);
        }

        .ctrl-item {
            //border-radius: 12px;
            //-webkit-border-radius:12px;
            .border-radius(12px);
            display: inline-block;
            width: 12px;
            height: 12px;
            margin: 0 8px;
            transition: all .2s ease-in;
            -webkit-transition: all .2s ease-in;
            background-color:#fff;
            //opacity:0.7;
            //filter: alpha(opacity=70);
            .opacity(0.7);
            //border: solid 2px #333;
            .border(#333,2px);
            zoom:1;
        }

        &:hover .ctrl-item{
             //border-radius: 14px;
             //-webkit-border-radius: 14px;
            .border-radius(14px);
             height: 14px;
             width: 14px
         }

        .ctrl-curr {
            background-color:#333;
            //opacity:0.7;
            //filter: alpha(opacity=70);
            .opacity(0.7);
            //border: solid 2px #fff;
            .border(#fff,2px);
        }
    }
    .tg-small {
        width: 1198px;
        height: 148px;
        //border: 1px solid #eaeaea;
        .border(#eaeaea);
        position: relative;
        background: #fff;
        margin-top:5px;

        .slide-go-left,
        .slide-go-right {
            position: absolute;
            z-index: 1;
            //width: 39px;
            //height: 148px;
            //line-height: 148px;
            //font-size: 28px;
            //color: #ccc;
            //text-align: center;
            font-family: "宋体";
            cursor: pointer;
            //background: #fafafa;
            .btn(39px,148px,28px,#ccc,#fafafa);

            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;

            &:hover{
                 background: #f2f2f2;
            }
        }
        .slide-go-left{
            left: 0;
        }
        .slide-go-right{
            right: 0;
        }

        .slide-inner {
            position: absolute;
            top: -10px;
            left: 39px;
            z-index: 2;
            width: 1120px;
            height: 168px;
            overflow-x: hidden;
            overflow-y: auto;
        }

        .slide-item {
            width: 280px;
            height: 148px;
            float: left;
            cursor: pointer;
            border-right:solid 1px #ececec;
        }
    }
    .slide-go-left i,
    .slide-go-right i{
        display: block;
        width:12px;
        height:20px;
        background:url("http://p1.qhmsg.com/t018dd20e41a1b701e2.png") no-repeat;
        margin:60px auto 0 auto;
    }
    .slide-go-left{
        i{
            background-position:-24px 0;
        }
        &:hover i{
            background-position:0 0;
        }
    }
    .slide-go-right{
        i{
            background-position:-36px 0;
        }
        &:hover i{
            background-position:-12px 0;
        }
    }

    /* 精选商品 */
    .hot-product-list {
        padding-top: 10px;
        color: #333;

        .slide-img {
            float: left;
            overflow: hidden;
            //text-align: center;
            //width: 110px;
            //height: 148px;
            //line-height: 148px;
            //font-size: 0;
            .btn(110px,148px,0);
            a {
                width: 110px;
                height: 148px;
                overflow: hidden;
                &:hover {
                    text-decoration: none;
                }
            }
            img {
                height: 100px;
            }
        }

        .slide-txt {
            position: relative;
            float: left;
            padding-top:12px;
            height: 134px;
            width:170px;
        }

        .p-tit {
            width: 150px;
            height: 42px;
            line-height: 1.3;
            font-size: 16px;
            color: #666;
        }

        .p-price {
            line-height: 1.2;
            font-size: 16px;
            color: #fc6621;
        }

        .p-orig-price {
            position: relative;
            height: 18px;
            font-size: 12px;
            color: #999;
        }

        .p-price-off {
            position: absolute;
            top: 0px;
            left: 44px;
            padding-left: 7px;
            width: 34px;
            height: 16px;
            line-height: 16px;
            text-align: center;
            color: #fff;
            background: url(http://p9.qhmsg.com/t01e7d33b82039e5dab.png) no-repeat 0 0;
        }

        .p-pri-num {
            font-size: 30px;
        }

        .p-price-org {
            padding-left: 30px;
            color: #a1a1a1;
            font-size: 12px;
            text-decoration: line-through;
        }

        .p-buy {
            position: absolute;
            bottom: 2px;
            display: block;
            width: 102px;
            height: 36px;
            line-height: 36px;
            background: #fc6621;
            color: #fff;
            text-align: center;
            font-size: 16px;
            text-decoration: none;

            &:hover {
                background: #f70;
            }
        }

        .p-buy-disabled,
        .p-buy-disabled:hover {
            color: #fff;
            background: #d8d3d0;
        }

        .lab-jx {
            position: absolute;
            top:0;
            left: -110px;
            display: block;
            width: 40px;
            height: 20px;
            background: #e4393c;
            text-align: center;
            color: #fff;
            line-height: 20px;
        }

        .lab-xsq {
            position: absolute;
            top: 11px;
            left : -120px;
            display: block;
            width: 46px;
            height: 20px;
            background: #f60;
            text-align: center;
            color: #fff;
            line-height: 20px;
        }

        .xsq-selling{
            .p-buy {
                display: none;
            }
            .p-buy-disabled {
                display: block;
            }
            .p-buy-not-start {
                display: none;
            }
            .p-tit {
                height: 42px;
                font-size: 14px;
            }

            .p-price {
                line-height: 1;
            }
            .countdown {
                position: absolute;
                bottom: 3px;
                left:30px;
                text-align: center;
                font-size: 0;

                span {
                    margin-right: 4px;
                    font-size: 14px;
                    line-height: 2.2;
                }

                .d-num,
                .h-num,
                .m-num,
                .s-num {
                    padding: 0 1px;
                    color: #f60;
                }

                .d-num,
                .d-txt {
                    display: none;
                }
            }

            .countdown-start-prev,
            .countdown-end-next {
                color: #999;
            }

            .countdown-start-prev{
                .d-num,
                .h-num,
                .m-num,
                .s-num {
                    color: #999;
                }
            }
        }
        .seckill{
            position:absolute;
            left:0;
            bottom:8px;
            color: #fc6621;
            font-size:14px;
            width:30px;
        }

        .slide-item-hover {
            position: relative;
            z-index: 9;
            box-shadow: 0 0 35px -10px #333;

            .p-buy {
                display: block;
            }
            .countdown {
                display: none;
            }
            .seckill{
                display: none;
            }
        }
    }

    /* 热销 */
    .hot-sales{
        //border: 1px solid #ebebeb;
        .border(#ebebeb);
        background: #fff;
        margin-bottom: 20px;

        .tit {
            font-size: 16px;
            color: #666;
            line-height: 38px;
            padding: 0 16px;
        }
        .hot-s-item {
            border-top: 1px solid #eaeaea;
            padding: 12px 20px;
            height: 80px;
            cursor: pointer;
        }
        .hot-s-txt {
            float: left;
            display: block;
            width: 175px;
            height: 80px;
            line-height: 80px;
            font-size: 18px;
            color: #666;
            overflow: hidden;
        }
        .hot-s-pic-wrap {
            float: right;
            margin: 0;
            width: 80px;
            height: 80px;
            text-align: center;
            overflow: hidden;
        }
        .hot-s-pic {
             height: 80px;
         }

        .hot-s-sn {
            font-size: 30px;
            margin-right: 10px;
            display: inline-block;
            _zoom: 1;
            vertical-align: middle;
            color: #999;
            font-family: arial;
        }

        .hot-s-sn-top {
            color: #fc6621;
        }
    }
}






